import { Dom } from '@antv/x6'
import config from '../../config'

export default function () {
  return this.createNode({
    shape: 'rect',
    width: 80,
    height: 20,
    attrs: {
      body: {
        ref: 'text',
        refWidth: 16,
        refHeight: 16,
        refX: -8,
        refY: -8,
        stroke: '#9254de',
        fill: '#efdbff'
      },
      'edit-text': {
        contenteditable: 'false',
        class: 'x6-edit-text',
        style: {
          width: '100%',
          textAlign: 'center',
          fontSize: config.nodeFontSize,
          color: config.nodeFontColor,
          overflow: 'visible'
        }
      },
      text: {
        fontSize: config.nodeFontSize,
        fill: config.nodeFontColor,
        textWrap: {
          text: '文本'
        }
      },
      data: {
        width: 80,
        height: 20,
        angle: 0
      }
    },
    markup: [
      {
        tagName: 'text',
        selector: 'text'
      },
      {
        tagName: 'foreignObject',
        selector: 'fo',
        children: [
          {
            ns: Dom.ns.xhtml,
            tagName: 'body',
            selector: 'foBody',
            children: [
              {
                tagName: 'div',
                selector: 'edit-text'
              }
            ]
          }
        ]
      }
    ]
  })
}
